<template>
    <div>
      <div class="content">
        
        <div class="area">
           <div style="width: 96%;margin: 0 auto;">
            <el-tabs
            v-model="activeName"
            class="demo-tabs"
            @tab-click="handleClick"
          >
            <el-tab-pane label="基础配置" name="first">
              <div class="table-area" style="position: relative;top: -24px;">
                    <div class="table-areas">
                              <div class="header-name">网站LOGO
                                <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="图片尺寸：180*80"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                              </div>
                              <div>
                                <div >

                                  <el-upload
                                  v-if="imgShow"
                                :file-list="transformFileList"
                                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                                list-type="picture-card"
                              
                                :on-preview="handlePreview"
                                :before-remove="
                                  (file) => handleBeforeRemove(file)
                                "
                                :on-remove="(file) => handleRemove(file)"
                              >
                                <!-- 隐藏默认上传按钮 -->
                                <template #trigger></template>
                                <!-- 保留插槽以维持卡片样式 -->
                              </el-upload>
                              <el-dialog draggable v-model="dialogVisible" width="75%">
                                <img 
                                  :src="previewUrl" 
                                  style="width: 100%; max-height: 80vh; object-fit: contain;"
                                  alt="预览图片"
                                >
                              </el-dialog>


                                      <div
                                       v-if="!imgShow"
                                        class="tutu"
                                        @click="btnTu"
                                        style="position: relative; left: 10px; top: -10px"
                                      >

                                        <el-icon><Plus /></el-icon>
                                        
                                      </div>
                                    </div>
                              </div>
                       </div>
                       <div class="table-areas">
                              <div class="header-name">网站ico图标

                                <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="图片尺寸：180*80"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                              </div>
                              <div>
                                <div >

                                  <el-upload
                                  v-if="imgShow2"
                                :file-list="transformFileList2"
                                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                                list-type="picture-card"
                              
                                :on-preview="handlePreview2"
                                :before-remove="
                                  (file) => handleBeforeRemove2(file)
                                "
                                :on-remove="(file) => handleRemove2(file)"
                              >
                                <!-- 隐藏默认上传按钮 -->
                                <template #trigger></template>
                                <!-- 保留插槽以维持卡片样式 -->
                              </el-upload>
                              <el-dialog draggable v-model="dialogVisible2" width="75%">
                                <img 
                                  :src="previewUrl2" 
                                  style="width: 100%; max-height: 80vh; object-fit: contain;"
                                  alt="预览图片"
                                >
                              </el-dialog>


                                      <div
                                       v-if="!imgShow2"
                                        class="tutu"
                                        @click="btnTu2"
                                        style="position: relative; left: 10px; top: -10px"
                                      >
                                        <el-icon><Plus /></el-icon>
                                      </div>
                                    </div>
                              </div>
                       </div>

                       <div class="table-areas">
                          <div>网站名称

                            <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="系统名称"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_system_name" />
                          </div>
                       </div>
                       <div class="table-areas">
                          <div>网站简称

                            <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="为优化推广而设置，尽量描述精炼，语句通顺"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_system_short_name" />
                          </div>
                       </div>
                       <div class="table-areas">
                          <div>网站描述

                            <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="为优化推广而设置，尽量描述精炼，语句通顺"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_system_description" type="textarea" />
                          </div>
                       </div>

                       <div class="table-areas">
                          <div>关键字

                            <span>
                            <el-tooltip
                              class="box-item"
                              effect="dark"
                              content="为优化推广而设置，多个词用英文逗号隔开 ','"
                              placement="top-start"
                            >
                              <el-icon style="position: relative; left: 3px; top: 2px">
                                <WarningFilled style="color: #2563eb" />
                              </el-icon> </el-tooltip
                          ></span>
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_keyword" />
                          </div>
                       </div>

                       <div class="table-areas">
                          <div>运营商

                         
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_operator" />
                          </div>
                       </div>
                       <div class="table-areas">
                          <div>ICP备案号

                         
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_icp_number" />
                          </div>
                       </div>
                       <div class="table-areas">
                          <div>公安备案号

                         
                          </div>
                          <div style="margin-top: 12px;">
                            <el-input v-model="basic_ga_number" />
                          </div>
                       </div>

                         <div style="margin-top: 12px;" @click="btnOk"> <el-button type="primary">提交</el-button></div>
                    </div>
            </el-tab-pane>
            <el-tab-pane label="用户配置" name="second">
              <div class="table-area">
                <div>
         <div>
          <div style="display: inline-block;width: 140px;">新用户注册默认:</div>
          <div>
            <el-radio-group v-model="member_is_open" style="position: relative;top: 3px;">
            <el-radio :label="1">开通</el-radio>
            <el-radio :label="0">禁用</el-radio>
           
          </el-radio-group>
          </div>
         </div>
          
            <div class="inputs" >
          <div style="display: inline-block;width: 140px;">新用户上级编号:</div>
            <div class="input-area"><el-input v-model="member_parent_id" style="width: 248px;" /></div>
         </div>

         <div class="inputs" >
          <div style="display: inline-block;width: 180px">新用户默认转账权限:</div>
          <div><el-switch v-model="member_is_account" /></div>
         </div>
          
         
          <div class="inputs" >
          <div style="display: inline-block;width: 140px;">新用户起始编号:</div>
          <div class="input-area">
            <el-input v-model="member_start_id" style="width: 248px;" />
          </div>
           
         </div>
         <div class="inputs" >
          <div style="display: inline-block;width: 140px;"> 转收入限额:</div>
            <div class="input-area"><el-input v-model="min_supply_money" style="width: 248px;" /></div>
         </div>
        
          
            <div class="inputs" >
          <div style="display: inline-block;width: 140px;"> 提成最大层数:</div>
            <div class="input-area"><el-input v-model="max_commission_floor" style="width: 248px;" /></div>
         </div>
         <div class="inputs" >
          <div style="display: inline-block;width: 140px;"> 供货商手续费:</div>
          <div class="input-area">  <el-input v-model="poundage" style="width: 248px;" /></div>
         </div>
        
       
          <div class="inputs" >
          <div style="display: inline-block;width: 145px;">注册必填上级编号:</div>
            
          <div><el-switch v-model="reg_need_fid" /></div>
         </div>
         <div class="inputs" >
          <div style="display: inline-block;width: 145px;">新用户交易密码:</div>
          <div> <el-switch v-model="noneed_userinput_pass" /></div>
         </div>
        
        
          <div class="inputs" >
          <div style="display: inline-block;width: 145px;">是否支持越级升级:</div>
         <div> <el-switch v-model="jump_up_level" /></div>
         </div>
         <div class="inputs " >
          <div style="display: inline-block;width: 205px;">是否支持越级开通分站套餐:</div>
            
         <div> <el-switch v-model="jump_open_site" /></div>
         </div>
       
       
          <div class="inputs" >
          <div style="display: inline-block;width: 200px;">新用户默认进货接口权限:</div>
          <div> <el-switch v-model="need_income_order_definde" /></div>
         </div>
         <div class="inputs" >
          <div style="display: inline-block;width:180px;">注册登陆密码二次确认:</div>
          <div> <el-switch v-model="need_two_send_password" /></div>
         </div>
        
      </div>
      

      <div style="display: flex; justify-content: center; margin-top: 32px">
        <el-button type="primary" @click="openOk">提交</el-button>
      </div>
              </div>
            </el-tab-pane>
           
            <el-tab-pane label="商品配置" name="shopping">
                <div class="table-area" style="position: relative;top: -48px;left: -3px;">
                  <shopping ref="shoppingRef" />
                </div>
            </el-tab-pane>
            <el-tab-pane label="游客管理" name="youke">
                <div class="table-area" style="position: relative;top: -48px;left: -3px;">
                  <youke ref="youkeRef" />
                </div>
            </el-tab-pane>
            <el-tab-pane label="分享设置" name="fenxiang">
                <div class="table-area" style="position: relative;top: -48px;left: -3px;">
                  <fenxiang ref="fenRef" />
                </div>
            </el-tab-pane>
            <el-tab-pane label="其他配置" name="qita">
                <div class="table-area" style="position: relative;top: -48px;left: -3px;">
                  <qita ref="qitaRef" />
                </div>
            </el-tab-pane>
          
          </el-tabs>
           </div>
  
          <!-- 新增分页组件 -->
        </div>
      </div>
  
     <!-- 批量修改图片 -->
     <el-dialog
      v-model="pingImgs"
      :show-close="false"
      draggable
      title="图片"
      width="66%"
    >
      <div class="img-area">
        <div class="img-right">
          <div>
            <el-button type="primary" @click="btnimgShows"
              >图片上传</el-button
            >

            <el-button @click="imgsOk" v-show="imgLieShow"
              >使用选中图片</el-button
            >
          </div>
          <div class="right-img">
            <div
              class="rightimg-wrapper"
              v-for="(item, index) in fileLists"
              :key="index"
             
            >
              <!-- 图片选中样式 -->
              <img
                class="rightimg"
                
                :src="item.url"
                :class="{'imgActive':imgActive == index}"
                style="height: 120px; width: 120px"
                @click="btnImg(item,index)"
              />
            </div>
          </div>

          <div class="pagination-container">
            <el-pagination
              style="margin-top: 30px"
              :current-page="pageImg"
              :page-size="limitImg"
              :total="total"
              :page-sizes="[10, 20, 30, 50]"
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="handlePageSizeChangeimg"
              @current-change="handleCurrentPageChangeimg"
            />
          </div>
        </div>
      </div>
    </el-dialog>
  

     <!-- 批量修改图片 -->
     <el-dialog
      v-model="pingImgs2"
      :show-close="false"
      draggable
      title="图片"
      width="66%"
    >
      <div class="img-area">
        <div class="img-right">
          <div>
            <el-button type="primary" @click="btnimgShows2"
              >图片上传</el-button
            >

            <el-button @click="imgsOk2" v-show="imgLieShow2"
              >使用选中图片</el-button
            >
          </div>
          <div class="right-img">
            <div
              class="rightimg-wrapper"
              v-for="(item, index) in fileLists"
              :key="index"
             
            >
              <!-- 图片选中样式 -->
              <img
                class="rightimg"
                
                :src="item.url"
                :class="{'imgActive2':imgActive2 == index}"
                style="height: 120px; width: 120px"
                @click="btnImg2(item,index)"
              />
            </div>
          </div>

          <div class="pagination-container">
            <el-pagination
              style="margin-top: 30px"
              :current-page="pageImg"
              :page-size="limitImg"
              :total="total"
              :page-sizes="[10, 20, 30, 50]"
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="handlePageSizeChangeimg"
              @current-change="handleCurrentPageChangeimg"
            />
          </div>
        </div>
      </div>
    </el-dialog>


        <!-- 上传图片 -->
        <el-dialog
      v-model="imgShows"
      :show-close="false"
      draggable
      title="上传图片"
      width="30%"
    >
      <div class="img-area">
        <div>
          <div class="jibies">
            <el-form-item label="上传方式">
              <el-radio-group v-model="imgdias">
                <el-radio :label="1">本地上传</el-radio>
                <el-radio :label="2">网络上传</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="上传图片" v-show="imgdias == 1">
              <el-upload
                v-model:file-list="fileList"
                class="upload-demo"
                :http-request="httpRequest"
                :on-preview="handlePreview3"
                :on-remove="handleRemove3"
                :on-success="handleUploadSuccess"
                list-type="picture"
              >
                <div class="tutu" @click="imgsOk3">
                  <el-icon><Plus /></el-icon>
                </div>
              </el-upload>
            </el-form-item>
            <el-form-item label="网络图片" v-show="imgdias == 2">
              <el-input
                style="width: 300px"
                v-model="textarea2"
              
               
              />
            </el-form-item>
          </div>
        </div>
      </div>
      <div style="display: flex; justify-self: center">
        <el-button type="primary" @click="pilaing1" v-show="imgdias ==1">确认</el-button>
        <el-button type="primary" v-show="imgdias==2"  @click="pilaing2">确认</el-button>
      </div>
    </el-dialog>
    </div>
  </template>
  
  <script lang="ts" setup>
const shoppingRef = ref(null)
const youkeRef=ref(null)
const fenRef=ref(null)
const qitaRef=ref(null)
const kefuRef=ref(null)
const tongjiRef=ref(null)
  import { watch } from 'vue'
import { useRoute } from 'vue-router'
import shopping from './compoent/shopping.vue'
import youke from './compoent/youke.vue'
import fenxiang from './compoent/fenxiang.vue'
import qita from './compoent/qita.vue'
import kefu from './compoent/kefu.vue'
import tongji from './compoent/tongji.vue'
  import { Plus,WarningFilled } from "@element-plus/icons-vue";
  import Quill from "quill";
  import "quill/dist/quill.snow.css"; // 引入样式
  import type { UploadProps } from "element-plus";
  const editorContainer = ref("");
  import {

  getUploadFiles,

} from "~/base/api/product/productList.ts";
  import { setMemberDefault,getMyConfigInfo,
    indexSetSave,
    uploadForHttps,
    uploads,getIndexSetInfo 
  } from "~/base/api/setup/index.ts";
  import {
    getList,
    getCustomerListRenderBeforeData,
  } from "~/base/api/admin/adminList.ts";
  import {
    PictureFilled,
    ArrowDown,
    CopyDocument,
    Picture,
    ArrowUp,
  } from "@element-plus/icons-vue";
  import { reactive, ref, onMounted, onBeforeUnmount } from "vue";
  import axios from "axios";
  import { Loading } from "@element-plus/icons-vue";
  import {
    ElMessageBox,
    ElMessage,
    ElLoading,
    componentSizeMap,
  } from "element-plus";
  const drawer = ref(false);
  const imgdias = ref(1);
  const textarea2=ref("")
  const fileList=ref([])
  const imgShows=ref(false)
  const imgLieShow=ref(false)
  const imgLieShow2=ref(false)
  const basic_system_name=ref("")
  const dengji = ref("");
  const activeName = ref("first");
  const route = useRoute()
  const member_is_open=ref(0)
  const selectedIndices2=ref([])
  const fileLists=ref([])
   const member_parent_id=ref(false)
const member_is_account=ref(false)
const urlImg=ref("")
const previewUrl=ref("")
const logoimg=ref("")
const icoimg=ref("")
const basic_system_short_name=ref("")
const basic_system_description=ref("")
const basic_operator=ref("")
const basic_icp_number=ref("")
const basic_ga_number=ref("")
const basic_keyword=ref("")
const urlImg2=ref("")
const previewUrl2=ref("")
const jump_open_site =ref(false)
const dialogVisible=ref(false)
const dialogVisible2=ref(false)
const pingImgs=ref(false)
const pingImgs2=ref(false)
const member_start_id=ref(false)
const imgShow=ref(false)
const imgShow2=ref(false)
const min_supply_money=ref(false)
const jump_up_level =ref(false)
const max_commission_floor=ref(false)
const poundage=ref(false)
const need_two_send_password=ref(false)
const need_income_order_definde=ref(false)
const cut_money_type=ref(0)
const noneed_userinput_pass=ref(false)
const reg_need_fid=ref(false)
const pageImg = ref(1);
const file_id=ref("")
const limitImg = ref(20);
const total=ref(0)
//初始化
  onMounted(() => {
    getMyConfigInfos()
    getimg()
    getIndexSetInfos()
    console.log('43322',route.query.userId)
    if(route.query.userId ==123){
      activeName.value='second'
    }
  });

  //获取数据
  function getIndexSetInfos(){
    getIndexSetInfo().then((res)=>{
      console.log('列表数据',res)
      basic_system_name.value=res.data.basic_system_name
      basic_system_short_name.value=res.data.basic_system_short_name
      basic_system_description.value=res.data.basic_system_description
      basic_keyword.value=res.data.basic_keyword
      basic_operator.value=res.data.basic_operator,
      basic_icp_number.value=res.data.basic_icp_number
      basic_ga_number.value=res.data.basic_ga_number
      if (res.data.logoimg) {
      transformFileList.value = [{
        name: 'logo.png', // 或从URL提取文件名
        url: res.data.logoimg,
        previewUrl: res.data.logoimg,
        status: 'success'
      }]
      imgShow.value = true // 手动触发显示
    }
    if (res.data.logoimg_src) {
      transformFileList2.value = [{
        name: 'favicon.ico', 
        url: res.data.logoimg_src,
        previewUrl: res.data.logoimg_src,
        status: 'success'
      }]
      imgShow2.value = true
    }

    })
  }



  const httpRequest = async (options) => {
  try {
    const formData = new FormData()
    formData.append('file', options.file)

    // 1. 打印原始文件信息（调试用）
    console.log('上传文件原始信息:', options.file.name)
  

    // 2. 调用上传接口
    const res = await uploads(formData)
    console.log('接口返回原始数据:', res) // 确保这里能打印
   
    // 3. 验证返回结构
    if (!res?.data?.url) {
      throw new Error('接口返回缺少URL字段')
    }

    // 4. 触发成功回调（按Element Plus要求的结构）
    options.onSuccess({
      name: options.file.name,
      url: res.data.url,
      status: 'success',
      uid: options.file.uid  // 必须保留！
    })

    // 5. 刷新图片库
    getimg()

    // 6. 最终打印（确保执行到这里）
    console.log('上传流程完成', res.data.url)
    return res
  } catch (err) {
    console.error('上传捕获错误:', err)
    options.onError(err)
   
  }
}

//提交
function btnOk(){
  let parm={
    logoimg:logoimg.value,
    icoimg:icoimg.value,
    basic_system_name:basic_system_name.value,
    basic_system_short_name:basic_system_short_name.value,
    basic_system_description:basic_system_description.value,
    basic_keyword:basic_keyword.value,
    basic_operator:basic_operator.value,
    basic_icp_number:basic_icp_number.value,
    basic_ga_number:basic_ga_number.value
  }
  indexSetSave(parm).then((res)=>{
    if (res.code == 200) {
      ElMessage({
        message: "操作成功",
        type: "success",
      });
    }else{
      ElMessage({
        message: res.msg,
        type: "success",
      });  
    }
  }).catch((error)=>{
    ElMessage({
      message: error.msg, // 显示错误详情
      type: "error", // ❌ 用 error，不要用 success
    });

  })
}

const handleUploadSuccess = (
  response: any,
  file: UploadFile,
  fileList: UploadFiles
) => {
  console.log("上传成功:", response);
  // imgsList.value.push({ url: response.data.data.url });
  // imgsListId.value.push(response.data.data.url);
  // forms.goods_imgs = imgsListId.value.join(",");
  // console.log("获取到的图片", forms.goods_imgs);
  // getimg();
  // 通常后端会返回图片URL或其他标识
};

  //图片分页
function handlePageSizeChangeimg(e) {
  selectedIndices.value = [];
  selectedIndices2.value = [];
  imgActive.value = 0;
  getimg();
}
function handleCurrentPageChangeimg(e) {
  selectedIndices.value = [];
  selectedIndices2.value = [];
  imgActive.value = 0;
  getimg();
}
//获取列表
function getMyConfigInfos(){
  getMyConfigInfo().then((res)=>{
    console.log('获取列表',res)
    member_is_open.value=Number(res.data.member_is_open)
    member_parent_id.value=res.data.member_parent_id
    member_is_account.value=res.data.member_is_account
    member_start_id.value=res.data.member_start_id
    min_supply_money.value=res.data.min_supply_money
    max_commission_floor.value=res.data.max_commission_floor
    poundage.value=res.data.poundage
    noneed_userinput_pass.value=res.data.noneed_userinput_pass
    reg_need_fid.value=res.data.reg_need_fid
    need_income_order_definde.value=res.data.need_income_order_definde
    need_two_send_password.value=res.data.need_two_send_password
    jump_up_level.value=res.data.jump_up_level
    jump_open_site.value=res.data.jump_open_site
  })
}
watch(
  () => route.query.userId,
  (newUserId) => {
    console.log('用户ID变化:', newUserId)
    // 可以在这里执行数据加载等操作
  }
)


const transformFileList=ref([

])


const transformFileList2=ref([

])

//获取图片
function getimg() {
  let parm = {
    page: pageImg.value,
    limit: limitImg.value,
  };

  getUploadFiles(parm).then((res) => {
   
    fileLists.value = res.data;
    console.log('获取到的图片',res.data)
    total.value = parseInt(res.count);
    
  });
}
//列表图片选择
// 数据定义
const selectedIndices = ref([]);  // 存储选中的图片信息
const listimgs = ref("");         // 选中的图片URL集合



const imgActive = ref(-1);
const imgActive2 = ref(-1);
//图片删除
const handleBeforeRemove= (file, row) => {
  return ElMessageBox.confirm("确定删除这张图片吗？", "警告", {
    type: "warning",
  })
    .then(() => true)
      
    .catch(() => false);
};
const handleRemove = async (file, row) => {
  try {
    console.log('file',file)
    imgShow.value=false
    ElMessage.success("删除成功");
  } catch (err) {
    ElMessage.error("删除失败");
  }
};


//图片删除
const handleBeforeRemove2= (file, row) => {
  return ElMessageBox.confirm("确定删除这张图片吗？", "警告", {
    type: "warning",
  })
    .then(() => true)
      
    .catch(() => false);
};
const handleRemove2 = async (file, row) => {
  try {
    console.log('file',file)
    imgShow2.value=false
    ElMessage.success("删除成功");
  } catch (err) {
    ElMessage.error("删除失败");
  }
};



const urlName=ref()
const urlName2=ref()
//点击图片
function btnImg(e,index){
  console.log('嗲你图片',e)
  imgActive.value=index
  imgLieShow.value=true
  urlImg.value=e.url
  urlName.value=e.name
 
}
//点击图片
function btnImg2(e,index){
  console.log('嗲你图片',e)
  imgActive2.value=index
  imgLieShow2.value=true
  urlImg2.value=e.url
  urlName2.value=e.name

}
const logoimg_src=ref("")
//打开图片
function btnTu2(){
  pingImgs2.value=true
  imgActive2.value=-1
}
//打开图片
function btnTu(){
  pingImgs.value=true
  imgActive.value=-1
}
//确定图片
function imgsOk(){
  pingImgs.value=false
  imgShow.value=true
  logoimg.value=urlImg.value
  transformFileList.value=[
    {
      name:urlName.value,
      url:urlImg.value,
      previewUrl: urlImg.value, // 高清大图
    status: 'success'
    }
  ]
}
//确定图片
function imgsOk2(){
  pingImgs2.value=false
  imgShow2.value=true
  icoimg.value=urlImg2.value
  transformFileList2.value=[
    {
      name:urlName2.value,
      url:urlImg2.value,
      previewUrl: urlImg2.value, // 高清大图
    status: 'success'
    }
  ]
}
const handlePreview = (file) => {
  console.log('预览文件:', file)
  previewUrl.value = file.previewUrl || file.url
  dialogVisible.value = true
}
const handlePreview2 = (file) => {
  console.log('预览文件:', file)
  previewUrl2.value = file.previewUrl || file.url
  dialogVisible2.value2 = true
}

//图片上传
function btnimgShows(){
  imgShows.value=true
  textarea2.value=''
}

//提交
function openOk(){

  let parm={
    member_is_open:member_is_open.value,
    member_parent_id:member_parent_id.value,
    member_is_account:member_is_account.value,
    member_start_id:member_start_id.value,
    min_supply_money:min_supply_money.value,
    max_commission_floor:max_commission_floor.value,
    poundage:poundage.value,

    noneed_userinput_pass:noneed_userinput_pass.value,
    reg_need_fid:reg_need_fid.value,
    need_income_order_definde:need_income_order_definde.value,
    need_two_send_password:need_two_send_password.value,
    jump_up_level:jump_up_level.value,
    jump_open_site:jump_open_site.value
  }
  setMemberDefault(parm).then((res)=>{
    if(res){
      ElMessage({
    message: '操作成功',
    type: 'success',
  })
      getMyConfigInfos()
    }
  })
}
  //上传图片确定
  function pilaing1(){
    imgShows.value=false
    getimg()
  }
   //上传网络图片
   function pilaing2(){
    if(textarea2.value== ''){
      ElMessage({
      showClose: true,
      message: "图片地址不能为空",
      type: "warning",
    });
    return;
  
    }
  
    uploadForHttps({file:textarea2.value}).then((res)=>{
      console.log('这个是啥',res)
      if(res.code ==200){
        ElMessage({
        message:res.msg,
        type: 'success',
      })
      imgShows.value=false
      getimg()
      }
    }).catch((res)=>{
      ElMessage({
        message:res.msg,
        type: 'warning',
      })
     
    })
   
  }

  </script>
  <style>


/* 不同高度的 tab-pane */
:deep(.el-tab-pane) {
  min-height: 200px; /* 默认最小高度，确保内容不会挤压 */
}

/* 基础配置 - 设置较高高度 */
:deep(.el-tab-pane[name="first"]) {
  height: 600px;
  overflow-y: auto; /* 确保内容溢出时滚动 */
}

/* 用户配置 - 中等高度 */
:deep(.el-tab-pane[name="second"]) {
  height: 400px;
  overflow-y: auto;
}

/* 登录注册 - 较低高度 */
:deep(.el-tab-pane[name="user"]) {
  height: 300px;
}

/* 商品配置 - 较高高度 */
:deep(.el-tab-pane[name="shopping"]) {
  height: 500px;
  overflow-y: auto;
}

/* 游客管理 - 自定义高度 */
:deep(.el-tab-pane[name="youke"]) {
  height: 50px;
  overflow-y: auto;
}













  .el-input.is-disabled .el-input__wrapper {
    background: white !important;
  }
  .el-upload el-upload--picture-card{
    display: none !important;
  }
  .el-upload--picture-card{
    display: none !important;
  }
  
  </style>
  <style scoped>
.lie-area{
  display: flex
}



  /* 调整卡片尺寸 */
.custom-upload .el-upload-list--picture-card .el-upload-list__item,
.custom-upload .el-upload--picture-card {
  width: 50px !important;
  height: 50px !important;
}

/* 调整图片填充方式 */
.custom-upload .el-upload-list__item-thumbnail {
  object-fit: cover;  /* 或 contain */
}


/* 强制覆盖 picture-card 样式 */
:deep(.el-upload-list--picture-card) .el-upload-list__item,
:deep(.el-upload--picture-card) {
  width: 60px !important;
  height: 60px !important;
}

/* 修复图片填充 */
:deep(.el-upload-list__item-thumbnail) {
  object-fit: cover !important;
}











  .table-areas{
    margin-top: 8px;
  }
  .deep .el-input.is-disabled .el-input__wrapper {
    background: white !important;
  }
  .order-titme {
  }
  
  .iconss {
    color: #999;
    cursor: pointer;
    position: relative;
    top: 3px;
  }
  .actives {
    background-color: #f0f7ff !important;
  }
  .iconss:hover {
    color: #1890ff;
  }
  
  .icons {
    font-size: 21px !important;
    position: relative !important;
    top: 18px !important;
    padding-right: 28px !important;
    left: 12px !important;
  }
  
  .icons2 {
    font-size: 50px !important;
    position: relative !important;
    top: 10px !important;
    padding-right: 28px !important;
    left: 12px !important;
  }
  
  .sanfang {
    margin-left: 12px;
    font-size: 11px;
    color: #1890ff;
    cursor: pointer;
  }
  .lie-top {
    display: flex;
    justify-content: center;
  }
  .lie-input {
    width: 100%;
    background-color: white;
  }
  .orders-names {
  }
  
  .order-names {
    display: flex;
    margin-top: 15px;
  }
  
  .order-information {
  }
  
  .order-detail {
    height: 142px;
    border-bottom: 1px solid #3333;
    margin-top: 10px;
    font-size: 13px;
    padding-bottom: 14px;
  }
  
  .activeTab {
    border-bottom: 1px solid #1890ff !important;
    color: #1890ff !important;
  }
  
  .activeTabs {
    border-bottom: 1px solid #1890ff !important;
    color: #1890ff !important;
  }
  
  .area-tab {
    display: flex;
    position: relative;
    left: -28px;
  }
  .area-tabs {
    height: 50vh;
    overflow: auto;
  }
  
  .area-name {
    margin-left: 30px;
    cursor: pointer;
    height: 31px;
  }
  
  .areas-header {
    height: 32px;
    border-bottom: 1px solid #3333;
    width: 100%;
  }
  
  .bianhao {
    margin-top: 16px;
    margin-left: 9px;
    font-size: 13px;
  }
  
  .right-name {
    margin-left: 8px;
  }
  
  .areas {
    width: 98%;
    margin: 0 auto;
  
    margin-top: 40px;
  }
  
  .quxiao {
    /* color: white;
            background-color: rgba(0, 0, 0, .65); */
    font-size: 12px;
    margin-top: 8px;
  }
  
  .type-name {
    margin-left: 80px;
  }
  .imgs {
    width: 70px;
    height: 70px;
    position: relative;
    top: 4px;
    border-radius: 6px;
  }
  .area-left {
    width: 24%;
  }
  .lefts {
    width: 84%;
    border: 1px solid #3333;
    height: 300px;
    margin-left: 18px;
    position: relative;
    top: 23px;
    border-radius: 8px;
  }
  .xx {
    position: absolute;
    right: -4px;
    color: red;
    top: -7px;
    cursor: pointer;
  }
  .types {
    display: flex;
    margin-top: 30px;
    position: relative;
  
    font-size: 13px;
  }
  .inputs2 {
    
    padding-left: 24px !important;
  }
  
  .imgsleft {
    width: 70px;
    height: 70px;
  }
  
  .img-left {
    width: 9%;
  }
  
  .img-content {
    margin-top: 12px;
    display: flex;
  }
  
  .contents-title {
    display: flex;
    margin-top: 14vh;
    justify-content: space-between;
  }
  
  .unbers {
    color: #1890ff;
    background-color: #e8f4ff;
    border-color: #d1e9ff;
    margin-left: 12px;
    font-size: 11px;
    height: 22px;
    width: 56px;
    text-align: center;
  }
  .input-area{
    margin-top: 12px;
  }
  .ordername {
    color: #333;
    border: 1px solid #3333;
    border-color: #333;
    /* padding: 1px 9px 1px 9px; */
    margin-left: 12px;
    height: 22px;
    width: 56px;
    text-align: center;
    font-size: 11px;
    line-height: 22px;
  }
  
  .kami {
    color: #13ce66;
    background-color: #e7faf0;
    border-color: #d0f5e0;
    font-size: 11px;
    height: 22px;
    width: 56px;
    text-align: center;
  }
  a {
    text-decoration: none;
    color: inherit;
  }
  .shu2 {
    width: 3px;
    height: 20px;
    background-color: #1890ff;
    position: relative;
    top: 25px;
    left: -8px;
  }
  .zhuangtai {
    display: flex;
    margin-top: 12px;
    font-size: 13px;
  }
  .imgs {
    width: 50px;
    height: 50px;
    position: relative;
    top: 4px;
    border-radius: 6px;
  }
  .right-header {
    width: 100%;
    border: 1px solid #3333;
    height: 80px;
  }
  .rights {
    display: flex;
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
    margin-top: 26px;
  }
  .shoyue {
    width: 72%;
    margin: 0 auto;
    margin-top: 12px;
    padding-left: 30px;
    padding-bottom: 2px;
    padding-top: 2px;
    cursor: pointer;
  }
  .left-header {
    height: 60px;
    width: 100%;
    line-height: 60px;
    border-bottom: 1px solid #3333;
  }
  .table-name {
    color: #1890ff;
    width: 60px;
    margin: 0 auto;
    cursor: pointer;
    font-size: 11px;
    text-align: center;
    height: 23px;
    line-height: 23px;
  }
  
  .table-name2 {
    border-color: rgba(0, 0, 0, 0.65);
    color: white;
    padding: 3px 5px 3px 9px;
    cursor: pointer;
  }
  
  .footerss {
    display: flex;
    width: 96%;
    margin: 0 auto;
    font-size: 13px;
  }
  .imglists {
    display: flex;
    margin-left: 9px;
    position: relative;
  }
  .footers {
    width: 98%;
    border: 1px solid #3333;
    margin: 0 auto;
    height: 100px;
    margin-top: 25px;
  }
  
  .tabname {
    color: #409eff !important;
    border-bottom: 2px solid #409eff !important;
  }
  
  .tab-name {
    margin-left: 18px;
    cursor: pointer;
    height: 30px;
  }
  .inputs {
    margin-top: 16px;
  }
  .header-area {
    display: flex;
    position: relative;
    left: -18px;
    top: 1px;
  }
  
  .names {
    background: #409eff !important;
    color: white !important;
    border: none !important;
  }
  
  .jiaoyi {
    background-color: #13ce66;
  }
  .rightimg {
  margin-left: 30px;
  height: 80px;
  width: 80px;
 margin-top: 20px;
  cursor: pointer;
}
.right-img {
  display: flex;
  flex-wrap: wrap;
}
  .header-name {
    font-size: 14px;
    padding-bottom: 18px;
  }
  
  .headers {
    display: flex;
    padding-bottom: 12px;
  }
  
  .m-2 {
    width: 160px;
  }
  
  .pagination-container {
    display: flex;
    justify-content: center;
    margin-top: 24px;
  }
  
  .configurations {
    margin-top: 12px;
  }
  
  .configuration-area {
  }
  
  .dialog-footer {
    margin: 0 auto;
    margin-top: 30px;
    text-align: center;
  }
  
  .orders-name {
    margin-top: 12px;
  }
  
  .orders {
    margin-left: 12px;
  }
  
  .order-area {
    width: 98%;
    padding-bottom: 12px;
    border: 1px solid #409eff;
    background-color: #e8f4ff;
  }
  .zanwu {
    display: flex;
    justify-content: center;
    position: relative;
    top: 25vh;
  }
  .tabs-area {
    margin-top: 12px;
  }
  .he {
    margin-left: 12px;
    color: #1890ff;
    cursor: pointer;
  }
  .diolog-content {
  }
  
  .shu {
    width: 3px;
    height: 20px;
    background-color: #1890ff;
    position: relative;
    top: 19px;
  }
  
  .shuaxin {
    font-size: 12px;
    color: #409eff;
    padding-right: 2px;
    cursor: pointer;
  }
  
  .table-area {
    width: 98%;
    margin: 0 auto;
    margin-top: 30px;
  }
  
  .tabs-price {
    border: 1px solid #3333;
    padding: 5px 12px 3px 12px;
  }
  
  .timeShow {
    color: red !important;
  }
  
  .tabs {
    margin-left: 10px;
  }
  
  .tab-header {
    display: flex;
    width: 100%;
  }
  .info-area {
    display: flex;
    white-space: nowrap;
    width: 88%;
  
    text-overflow: ellipsis;
    white-space: nowrap;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
  
    cursor: pointer;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed var(--el-border-color);
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: var(--el-transition-duration-fast);
  }
  .avatar-uploader .avatar {
    width: 178px;
    height: 178px;
    display: block;
    text-align: center;
  }
  .avatar-uploader .el-upload:hover {
    border-color: var(--el-color-primary);
  }
  .custom-editor {
    flex-grow: 1; /* 编辑区域填充剩余空间 */
  }
  .el-icon.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    text-align: center;
  }
  .avatar-uploader {
    position: relative;
  
    left: 10px;
    width: 80px;
    height: 80px;
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s;
  }
  .avatar-uploader:hover {
    border-color: #409eff;
    background-color: #f5f7fa;
  }
  .info-area2 {
  }
  .info-area:hover {
    color: #1890ff;
  }
  .area {
    width: 100%;
    background-color: white;
    padding-bottom: 28px;
    margin-top: 18px;
    padding-top: 14px;
  
  }
  
  .content {
    width: 96%;
    margin: 0 auto;
    height: 80vh;
    margin-top: 26px;
  }
  
  .header {
    background-color: white;
    padding: 17px 0 1px 12px;
    border-radius: 8px;
  }
  
  .is-loading {
    animation: rotating 2s linear infinite;
  }
  
  @keyframes rotating {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }
  
  /* 基础响应式设置 */
  .content {
   
  }
  
  /* 表格区域响应式 */
  .table-area {
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
    overflow-x: auto;
  }
  
  /* 分页容器 */
  .pagination-container {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    overflow-x: auto;
  }
  .imgActive {
    border: 2px solid #409eff !important;
  border-color: #409eff !important; /* 选中时高亮边框 */
}
.imgActive2 {
    border: 2px solid #409eff !important;
  border-color: #409eff !important; /* 选中时高亮边框 */
}

.yuan {
  position: absolute;
  top: 24px;
  left: 85px;
  /* right: -49px; */
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f56c6c;
  color: white;
  text-align: center;
  line-height: 20px;
  font-size: 12px;
}
  /* 对话框内容 */
  .diolog-content {
    padding: 10px;
  }
  
  /* 标签页区域 */
  .tabs-area {
    margin-top: 12px;
  }
  
  /* 配置区域 */
  .configurations {
    margin-top: 12px;
  }
  
  /* 对话框底部按钮 */
  .dialog-footer {
    margin: 20px auto 0;
    text-align: center;
  }
  .nameshopping {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 70px;
    cursor: pointer;
    text-align: center;
  }
  .nameshopping:hover {
    color: #1890ff;
  }
  /* 订单区域 */
  .order-area {
    width: 100%;
    padding: 12px;
    border: 1px solid #409eff;
    background-color: #e8f4ff;
    box-sizing: border-box;
  }
  .tblas {
  }
  /* 刷新按钮样式 */
  .shuaxin {
    font-size: 12px;
    color: #409eff;
    padding-right: 2px;
    cursor: pointer;
  }
  
  /* 加载动画 */
  .is-loading {
    animation: rotating 2s linear infinite;
  }
  
  @keyframes rotating {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }
  .tupians {
    display: flex;
  }
  /* 响应式调整 */
  @media (max-width: 768px) {
    /* 头部表单 */
    .header {
      padding: 10px;
    }
  
    /* 表单项目 */
    .el-form-item {
      width: 100%;
      margin-right: 0;
      margin-bottom: 10px;
    }
  
    /* 标签页 */
    .el-tabs {
      overflow-x: auto;
    }
  
    /* 对话框内容 */
    .diolog-content {
      padding: 5px;
    }
  
    /* 输入框宽度 */
    .el-input {
      width: 100% !important;
    }
  
    /* 表格操作按钮 */
    .el-table-column--fixed-right .el-button {
      margin-bottom: 5px;
    }
  
    /* 标签页头 */
    .tab-header {
      flex-direction: column;
    }
  
    .tabs {
      margin: 5px 0;
    }
  
    /* 对话框标题 */
    .el-dialog__title {
      font-size: 16px;
    }
  }
  
  /* PC端特定样式 */
  @media (min-width: 769px) {
    .content {
      /* max-width: 1200px; */
    }
  
    .table-area {
      width: 98%;
    }
  
    .diolog-content {
      min-width: 500px;
    }
  
    .el-form--inline .el-form-item {
      margin-right: 10px;
    }
  }
  .tutu {
  border: 1px solid #3333;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  cursor: pointer;
 position: relative;
 left: -0px !important;
}
.img-area {
  display: flex;
}
.img-area {
  display: flex;
}
.mg-area {
  display: flex;
}
.img-left {
  width: 12%;
}
.img-right {
  flex: 1;
  padding-left: 30px;
}
.zanwu {
  margin-top: 30px;
  text-align: center;
}
.area-right {
  height: 53vh;
  margin-top: 20px;
  overflow: auto;
}
.right {
  flex: 1;
}
.left {
  width: 30%;
  padding-right: 20px;
}
  </style>
  